<template>
    <div class="table">
        <el-table
            :data="tableData"
            style="width:100%"
            border=""
        >
            <el-table-column
                type="expand"
            >
                <template slot-scope="props">
                    <el-form label-position="left" inline >
                        <el-form-item label="提问问题：">
                            <span style="color:#333;margin:0 30px 0 10px;">{{props.row.askNum}}个</span>
                            <el-button type="text">查看该用户提问的问题</el-button>
                        </el-form-item>
                    </el-form>

                    <el-form label-position="left" inline >
                        <el-form-item label="回答问题：">
                            <span style="color:#333;margin:0 30px 0 10px;">{{ props.row.answerQueNum }}个</span>
                            <el-button type="text">查看该用户回答的问题</el-button>
                        </el-form-item>
                    </el-form>

                    <el-form label-position="left" inline >
                        <el-form-item label="全部回答：">
                            <span style="color:#333;margin:0 30px 0 10px;">{{ props.row.answerNum }}个</span>
                            <el-button type="text">查看该用户全部的回答</el-button>
                        </el-form-item>
                    </el-form>

                    <el-form label-position="left" inline v-if="props.row.isExpert">
                        <el-form-item label="查看Ta的专家资料：">
                            <el-button type="text">点击查看</el-button>
                        </el-form-item>
                    </el-form>

                    <el-form label-position="left" inline >
                        <el-form-item label="关注的问题：">
                            <el-button type="text">点击查看</el-button>
                        </el-form-item>
                    </el-form>

                    <el-form label-position="left" inline >
                        <el-form-item label="关注的专家：">
                            <el-button type="text">点击查看</el-button>
                        </el-form-item>
                    </el-form>


                </template>

            </el-table-column>

            <el-table-column
                type="index"
            ></el-table-column>

            <el-table-column
                label="用户头像"
            >
                <template slot-scope="scope">
                    <img :src="scope.row.userAvatar" alt="" style="width: 1rem; height: 1rem">
                </template>
            </el-table-column>

            <el-table-column
                label="用户名"
                prop="userName"
            ></el-table-column>

            <el-table-column
                label="是否专家"
            >
                <template slot-scope="scope">
                    <span>{{ scope.row.isExpert ? '是' : '否' }}</span>
                </template>
            </el-table-column>

            <el-table-column
                label="是否被拉黑"
            >
                <template slot-scope="scope">
                    <span>{{ scope.row.isBlack ? '是' : '否' }}</span>
                </template>
            </el-table-column>

            <el-table-column
                label="已解决问题"
                prop="solveQuestionNum"
            ></el-table-column>

            <el-table-column
                label="可提现金额"
                prop="haveMoney"
            ></el-table-column>

            <el-table-column
                label="用户手机号码"
                prop="userPhone"
            ></el-table-column>

            <el-table-column
                label="操作"
            >
                <template slot-scope="scope">
                    <el-button type="text" size="mini" @click="lookUser(scope.$index)">查看</el-button>
                    <el-button type="text" size="mini" @click="delUser(scope.$index)">删除</el-button>
                </template>
            </el-table-column>

        </el-table>
    </div>
</template>

<script>
export default {
    name: 'Table',
    props: {
        tableData: Array
    },
    data () {
        return {
         
        }
    },
    methods: {
        lookUser (index) {
            this.$emit('lookUser', index);
        },
        delUser (index) {
            this.$emit('delUser', index);
        }
    }
}
</script>

<style lang="stylus" scoped>
    .table
        width 100%
        height 100%
</style>


